<script>
	import Vue from 'vue';
	export default {
		onLaunch: function() {
			console.log('App Launch');
			
			uni.getSystemInfo({
				success: function(e) {
					// #ifndef MP
					Vue.prototype.StatusBar = e.statusBarHeight;
					Vue.prototype.ScreenWidth = e.screenWidth;
					Vue.prototype.ScreenHeight = e.screenHeight;
					if (e.platform == 'android') {
						Vue.prototype.CustomBar = e.statusBarHeight + 50;
					} else {
						Vue.prototype.CustomBar = e.statusBarHeight + 45;
					};
					// #endif
			
					// #ifdef MP-WEIXIN
					Vue.prototype.StatusBar = e.statusBarHeight;
					let custom = wx.getMenuButtonBoundingClientRect();
					Vue.prototype.Custom = custom;
					Vue.prototype.CustomBar = custom.bottom + custom.top - e.statusBarHeight;
					// #endif		
			
					// #ifdef MP-ALIPAY
					Vue.prototype.StatusBar = e.statusBarHeight;
					Vue.prototype.CustomBar = e.statusBarHeight + e.titleBarHeight;
					// #endif
				}
			})
			
		},
		mounted() {
			
		},
		methods: {
			
		},
		onShow: function() {
			console.log('App Show');
			
		},
		onHide: function() {
			console.log('App Hide')
		}
	}
</script>

<style lang="less">
	/*每个页面公共css */
	page{
		// height: auto;
		font-size: 28rpx;
		color: #262626;
	}
	view{
		box-sizing: border-box;
	}
	.contents{
		padding: 30rpx;
	}
	/*
		font-size   f-[12-36]
	 */
	.font(@n, @i: 12) when (@i <= @n) {
		.f-@{i} {
			font-size: @i * 2rpx;
			
		}
		.font(@n, (@i+1))
	}
	.font(36);
	/**
	 * font-weight: 600;  f-w-600
	 * font-weight: 700;  f-w-700
	 */
	.f-w-600 {
		font-weight: 600;
	}
	.f-w-700 {
		font-weight: 700;
	}
	.fontBold{
		font-weight: bold;
	}
	/* 
		padding-left 	 p-l-[1-30]
		padding-right    p-r-[1-30]
		padding-top      p-t-[1-30]
		padding-bottom   p-b-[1-30]
	 */
	.p-l(@n, @i: 1) when (@i <= @n) {
		.p-l-@{i} {
			padding-left: @i * 2rpx;
		}
		.p-l(@n, (@i+1))
	}
	.p-l(40);
	
	.p-r(@n, @i: 1) when (@i <= @n) {
		.p-r-@{i} {
			padding-right: @i * 2rpx;
		}
		.p-r(@n, (@i+1))
	}
	.p-r(40);
	.p-t(@n, @i: 1) when (@i <= @n) {
		.p-t-@{i} {
			padding-top: @i * 2rpx;
		}
		.p-t(@n, (@i+1))
	}
	.p-t(30);
	.p-b(@n, @i: 1) when (@i <= @n) {
		.p-b-@{i} {
			padding-bottom: @i * 2rpx;
		}
		.p-b(@n, (@i+1))
	}
	.p-b(30);
	/* 
		margin-left    m-l-[1-30]
		margin-right   m-r-[1-30]
		margin-top     m-t-[1-30]
		margin-bottom  m-b-[1-30]
	*/
	.m-l(@n, @i: 1) when (@i <= @n) {
		.m-l-@{i} {
			margin-left: @i * 2rpx !important;
		}
		.m-l(@n, (@i+1))
	}
	.m-l(40);
	.m-r(@n, @i: 1) when (@i <= @n) {
		.m-r-@{i} {
			margin-right: @i * 2rpx !important;
		}
		.m-r(@n, (@i+1))
	}
	.m-r(40);
	.m-t(@n, @i: 1) when (@i <= @n) {
		.m-t-@{i} {
			margin-top: @i * 2rpx;
		}
		.m-t(@n, (@i+1))
	}
	.m-t(30);
	.m-b(@n, @i: 1) when (@i <= @n) {
		.m-b-@{i} {
			margin-bottom: @i * 2rpx;
		}
		.m-b(@n, (@i+1))
	}
	.m-b(30);
	/*
		border-radius    b-r-[5%-50%]
	*/
	.b-r(@n, @i: 5) when (@i <= @n) {
		.b-r-@{i} {
			border-radius: @i * 2rpx;
		}
		.b-r(@n, (@i+1))
	}
	.b-r(50);
	
	.scale-1px-bottom{
		position: relative;
		border: none;
	}
	.scale-1px-bottom::after{
		content: '';
		position: absolute;
		bottom: 0;
		right: 0;
		background: #dddddd;
		height: 1px;
		width: 100%;
		-webkit-transform: scaleY(0.5);
		transform: scaleY(0.5);
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
	}
	.width100{
		width: 100%;
	}
	.position-rel{
		position: relative;
	}
	.text-inde{
		text-indent: 2em;
	}
	/*
		z-index   z-[1-100]
	 */
	.z-i(@n, @i: 1) when (@i <= @n) {
		.z-@{i} {
			z-index: @i;
		}
		.z-i(@n, (@i+1))
	}
	.z-i(100);
	/**
	 * 	flex
	 */
	.disCenter{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.dis-inline{
		display: inline-block;
	}
	.flex {
		display: flex;
	}
	.flex-1 {
		flex: 1;
	}
	.flex-none{
		flex:none;
	}
	.flex-direction {
		flex-direction: column;
	}
	.flex-wrap {
		flex-wrap: wrap;
	}
	.align-center {
		align-items: center;
	}
	.align-start {
		align-items: flex-start !important;
	}
	.align-end {
		align-items: flex-end !important;
	}
	.justify-center {
		justify-content: center;
	}
	.justify-space-between {
		justify-content: space-between;
	}
	.justify-space-around {
		justify-content: space-around;
	}
	.justify-start {
		justify-content: flex-start;
	}
	.justify-end {
		justify-content: flex-end !important;
	}
	
	/**
	 * text-overflow-1  单行溢出隐藏
	 * text-overflow-n  多行溢出隐藏
	 */
	.text-overflow-1 {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	
	.text-overflow(@n, @i: 2) when (@i <= @n) {
		.text-overflow-@{i} {
			overflow: hidden;
			text-overflow: ellipsis;
			display: -webkit-box;
			-webkit-line-clamp: @i;
			-webkit-box-orient: vertical;
		}
		.text-overflow(@n, (@i+1))
	}
	.text-overflow(5);
	.text-center{
		text-align: center;
	}
	.text-right{
		text-align: right;
	}
	.text-left{
		text-align: left;
	}
	/**
	 * 	color	primary   主题红色
	 * 			orange    辅助橙色
	 * 	  		blue      蓝色按钮
	 * 			success   绿色
	 * 			red       红色
	 * 			brown     会员深棕色
	 * 			gray      字体灰色
	 * 			yellow    淡黄
	 */
	.bg-col {
		background-color: #F5F5F9;		// 灰色背景底色
	}
	.bg-white{
		background-color: #fff;
	}
	.bg-blue{
		background-color: #529EFF;
	}
	.primary {
		color: #FF7D61;
	}
	.orange {
		color: #FF4200;
	}
	.blue {
		color: #529EFF;
	}
	.success {
		color: #0aa713;
	}
	.red {
		color: #de1923;
	}
	.red-2 {
		color: #f13c5f;
	}
	.brown {
		color: #9f330d;
	}
	
	
	.white {
		color: #FFFFFF !important;
	}
	.black-9 {
		color: #999999 !important;
	}
	.black-6 {
		color: #666666 !important;
	}
	.black-3 {
		color: #333333 !important;
	}
	.black-4 {
		color: #444444 !important;
	}
	.black {
		color: #000000 !important;
	}
	.black-b {
		color: #bbbbbb !important;
	}
	/**
	 * btn-[small,large,normal]
	 */
	uni-button {
		margin: 0;
	}
	uni-button[plain], .button-hover[plain] {
		display: flex;
		justify-content: center;
		align-items: center;
		line-height: 1;
		color: #FFFFFF;
		border: none;
	}
	
	.btn-small-1 {
		width: 130rpx;
		height: 60rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		border: none !important;
		color: #FFFFFF !important;
	}
	
	.btn-small-2 {
		width: 150rpx;
		height: 60rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		border: none !important;
		color: #FFFFFF !important;
	}
	
	.btn-small-3 {
		width: 180rpx;
		height: 66rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		border: none !important;
		color: #FFFFFF !important;
	}
	
	.btn-small-4 {
		width: 230rpx;
		height: 74rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 28rpx;
		border: none !important;
		color: #FFFFFF !important;
	}
	
	.btn-large {
		margin: 0 40rpx;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 32rpx;
		color: #FFFFFF !important;
		border: none !important;
	}
	.btn-normal {
		width: 100%;
		height: 80rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 30rpx;
		color: #FFFFFF !important;
		border: none !important;
	}
	.nodata {
		text-align: center;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		color: #aaaaaa;
		font-size: 30upx;
	}
	.icon-super{
		position: absolute;
		z-index: 2;
		top: -12upx;
		left: 52upx;
		width: 45upx;
		height: 45upx;
	}
</style>
